import React from "react";
import { Code } from "../../Code";
import "./style.css";
export default function Index() {
  return (
    <div className="page column">
      <div className="sub-title">性能优化-1</div>
      <p>合并样式修改</p>
      <div className="cover">
        <div>
          <div>bad case:</div>
          <Code lang="js">{`const el = document.getElementById('test');
el.style.padding = '5px';
el.style.borderLeft = '1px';
el.style.borderRight = '2px';
//作者：奶茶好喝不胖(zhihu)`}</Code>
        </div>
        <div>
          <div>good case:</div>
          <Code lang="js">{`const el = document.getElementById('test'); 
el.style.cssText += 'border-left: 1px;'+
                    'border-right: 2px;'+
                    'padding: 5px;'; 
//作者：奶茶好喝不胖(zhihu)`}</Code>
        </div>
      </div>
    </div>
  );
}
